import { createApp } from "vue";
import App from "./App.vue";
import "./utils/storage";
import ElementPlus from "element-plus";
import "element-plus/dist/index.css";
import router from "./router";
import "./assets/css/index.css";
import "@/assets/css/cover-element.scss";

import { createPinia } from "pinia";
import SvgIcon from "@/components/SvgIcon.vue";
import PageHeader from "@/components/PageHeader.vue";

import i18n from "@/i18n";

const app = createApp(App);
app.use(createPinia());
app.component("SvgIcon", SvgIcon);
app.component("PageHeader", PageHeader);
app.use(ElementPlus, {
  // locale: i18n.global.locale.value === 'zh' ? zhCn : en,
});
app.use(router);
app.use(i18n);
app.mount("#app");


// 自定义按钮权限directive
const myPointDirective = (el,binding) => {
  const roles = Storage.get("roles", true) || []
  if(roles?.includes('admin')){
    return
  }
  if (!roles?.some(item=> item === binding.value)) {
      el.style.display = 'none'
  }
}

const myPointDirectiveHide = (el,binding) => {
  const roles = Storage.get("roles", true) || []
  if(roles?.includes('admin')){
    return
  }
  if (roles?.some(item=> item === binding.value)) {
      el.style.display = 'none'
  }
}
//  全局注册指令
app.directive('my-point', myPointDirective);
app.directive('my-point-hide', myPointDirectiveHide);